<template>
  <ekDialog
    v-model="ekVisiable"
    title="接口分配"
    @submit="handleSubmit"
    :hideBtn="disabled"
  >
    <div class="ek-form" v-loading="loading">
      <el-form
        :model="form"
        :rules="rules"
        label-width="160px"
        :disabled="disabled"
      >
        <el-form-item label="节点编码">
          <ekInput :modelValue="rowId" :disabled="true" />
        </el-form-item>
        <el-form-item prop="node_apis" label="节点接口">
          <ekTextarea v-model="form.node_apis" :rows="6" />
          <ekTip content="多个接口换行分隔" />
        </el-form-item>
      </el-form>
    </div>
  </ekDialog>
</template>

<script setup>
import { watch, getCurrentInstance, computed, ref, defineEmits } from "vue";
import { apis } from "../data.js";
import ekDialog from "@/components/business/ekDialog/index.vue";
import ekInput from "@/components/form/ekInput/index.vue";
import ekTextarea from "@/components/form/ekTextarea/index.vue";
import ekTip from "@/components/business/ekTip/index.vue";
const props = defineProps({
  // 显示隐藏
  visiable: {
    type: Boolean,
    default: false,
  },
  rowId: {
    type: [String, Number],
    default: "",
  },
  title: {
    type: String,
    default: "",
  },
  disabled: {
    type: Boolean,
    default: false,
  },
});
const {
  appContext: {
    config: { globalProperties },
  },
} = getCurrentInstance();
const { $storage, $http, $ekLoading, $ekMessage } = globalProperties;

const emit = defineEmits(["update:visiable", "submit"]);

// 是否显示
const ekVisiable = computed({
  get() {
    return props.visiable;
  },
  set(value) {
    emit("update:visiable", value);
  },
});
const treeRef = ref(null);
function handleSubmit(done) {
  let node_apis = form.value.node_apis.split("\n");
  $http
    .post(apis.api, {
      node_code: props.rowId,
      node_apis: node_apis,
    })
    .then((res) => {
      $ekMessage.success(res.message);
      emit("submit", done);
    })
    .catch((err) => {});
}
const loading = ref(false);

let form = ref({
  node_apis: "",
});

// 初始化表单
async function init() {
  // 详情或者编辑
  if (props.rowId) {
    let res = await $http.get(apis.getApi, {
      params: {
        node_code: props.rowId,
      },
    });
    if (res.status == "success") {
      form.value.node_apis = res.data.node_apis.join("\n");
    }
  }
}
watch(
  () => props.visiable,
  async (val) => {
    if (val) {
      loading.value = true;
      await init();
      loading.value = false;
    }
  }
);
</script>

<style scoped lang="scss"></style>
